<template>
  <div class="mainaa" style="width:100%;height:100%;">
      <LetterCube class="loadingB" :size="sizes" />
  </div>
</template>

<script>
  import { RotateSquare2,Origami,LetterCube,Socket } from 'vue-loading-spinner'
  export default {
    props:['size'],
      name:'loadingTem',
    components: {
      RotateSquare2,
      Origami,
      LetterCube,
      Socket,
    },
    data(){
        return{
            sizes:'200px'
        }
    },
    created(){
      this.init()
    },
    methods:{
      init(){
        this.sizes=this.size
      }
    }
  }
</script>
<style scoped>
.mainaa{
  position: relative;
  background: rgba(236, 236, 236, 0.5);
}
.loadingB{
  position: absolute;
  z-index: 100;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}
</style>